import React, {useEffect, useState} from 'react';
import {View,} from '@tarojs/components';
import {List, Loading, Tabs} from "@taroify/core"


import styles from './index.module.scss';
import EvaluateDetail from "@/mall/pages/evaluate/EvaluateDetail";

const Index: React.FC = () => {
    const [value, setValue] = useState(0)
    const [hasMore, setHasMore] = useState(true)
    const [list, setList] = useState<string[]>([])
    const [loading, setLoading] = useState(false)

    useEffect(() => {
        load();
    }, []);

    const load = async () => {
    }


    return (
        <View className={styles.page}>
            <Tabs sticky swipeable value={value} onChange={setValue}>
                <Tabs.TabPane title="全部" badge={47}></Tabs.TabPane>
                <Tabs.TabPane title="带图" badge={1}></Tabs.TabPane>
                <Tabs.TabPane title="好评" badge={45}></Tabs.TabPane>
                <Tabs.TabPane title="中评" badge={2}></Tabs.TabPane>
                <Tabs.TabPane title="差评" badge={2}></Tabs.TabPane>
            </Tabs>
            <List
                loading={loading}
                hasMore={hasMore}
                onLoad={() => {
                    setLoading(true)
                    setTimeout(() => {
                        for (let i = 0; i < 10; i++) {
                            const text = list.length + 1
                            list.push(text < 10 ? "0" + text : String(text))
                        }
                        setList([...list])
                        setHasMore(list.length < 40)
                        setLoading(false)
                    }, 1000)
                }}
            >
                {
                    list.map((item) => (
                        <EvaluateDetail key={item}></EvaluateDetail>
                    ))
                }
                <List.Placeholder>
                    {loading && <Loading>加载中...</Loading>}
                    {!hasMore && "没有更多了"}
                </List.Placeholder>
            </List>
        </View>
    );
};

export default Index;
